<template>
  <div class="box">
    <div class="box1">
      <Zi1 :arr="data" />
      <Zi2 @xiaoming="fun"/>
    </div>
  </div>
</template>

<script>
import Zi1 from "../find/findzi1";
import Zi2 from "../find/findzi2";

export default {
  methods: {
    fun(data) {
     console.log(data)
    },
  },
  data() {
    return {
      data: [
        { img: "/find/1.png", p: "动作" },
        { img: "/find/2.png", p: "策略" },
        { img: "/find/3.png", p: "冒险" },
        { img: "/find/4.png", p: "休闲" },
        { img: "/find/5.png", p: "单机" },
        { img: "/find/6.png", p: "模拟经营" },
        { img: "/find/7.png", p: "多人" },
        { img: "/find/8.png", p: "角色扮演" },
        { img: "/find/9.png", p: "剧情" },
        { img: "/find/10.png", p: "更多分类" },
      ],
    };
  },
  components: {
    Zi1,
    Zi2,
  },
};
</script>

<style scoped>
.box {
  width: 100%;
  height: 2.1288rem;
  /* background-color: pink; */
}
.box1 {
  width: 3.432rem;
  /* height: 1.6288rem; */
  /* background-color: orange; */
  margin: auto;
}
</style>